<template>
	<yd-layout id='storeSystem' class=''>
		
		<yd-infinitescroll v-show='dataList.length>0' :callback="getGoodsList" ref="infinitescrollDemo">
			<div class="store_list_f" slot="list">
				<div class="store_list" v-for="item in dataList" @click="goStoreDetail(item)">
					<img class="store_img" :src="item.title_img" alt="" />
					<div class="store_list_title c_text_ellipsis_1">{{item.title}}</div>
					<div class="store_list_money c_text_ellipsis_1">￥{{item.price}}</div>
				</div>
			</div>
				
			<!-- 数据全部加载完毕显示 -->
			<span slot="doneTip">没有更多数据了~~</span>

			<!-- 加载中提示，不指定，将显示默认加载中图标 -->
			<!--<img slot="loadingTip" src="path/img/loading.svg"/>-->
		</yd-infinitescroll>
		<NoList v-if='dataList.length==0'>
			<img slot='img' src="../../assets/byBookrack.png" alt="" />
		</NoList>
		<img class="go_car" @click="goCar" src="../../assets/store_syscar.png" alt="" />
	</yd-layout>
</template>

<script>
	import NoList from '../../components/CybList/CybList.vue'
	import { InfiniteScroll } from 'vue-ydui/dist/lib.rem/infinitescroll';
	export default {
		components: {
			[NoList.name]: NoList,
			[InfiniteScroll.name]: InfiniteScroll,
		},
		data() {
			return {
				dataList: [],
				pageNum:1,
				pageCount:20,
			}
		},
		created() {},
		watch: {

		},
		computed: {

		},
		mounted() {
			document.title = '系统商城'
			this.getGoodsList()
		},
		methods: {
			goCar(){
				this.$router.push({name:'storeCar'})
			},
			getGoodsList() {
				this.$root.ajax({
					name: 'mall/goods/lst',
					params: {
						page:this.pageNum,
						count:20,
					},
				}).then((d) => {
					
					for(let a = 0; a < d.data.goods_list.length; a++) {
						d.data.goods_list[a].price = this.$root.setMoneyZero(d.data.goods_list[a],'price')
					}
					this.dataList = [...this.dataList, ...d.data.goods_list];
					if(this.dataList.length >= d.data.goods_total) {
						/* 所有数据加载完毕 */
						this.$refs.infinitescrollDemo.$emit('ydui.infinitescroll.loadedDone');
						return;
					}

					/* 单次请求数据完毕 */
					this.$refs.infinitescrollDemo.$emit('ydui.infinitescroll.finishLoad');

					this.pageNum++;
				})
			},
			//去商品详情页面
			goStoreDetail(item) {
				this.$router.push({
					name: 'storeDetail',
					query: {
						id: item.id
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	@import './storeSystem.scss';
</style>